<template>
    <div id="content-detail">
      <div class="detail-page" v-for="(deail, index) in detaillist" :key="index">
        <div class="detail-title"><span>推广</span>{{deail.title}}</div>
        <div class="detail-header">
          <div>
            <img :src="deail.picUrl"/>
            </div>
          <div><p>{{deail.title}}</p><p>{{deail.createTime}} 阅读量：{{deail.readCnt}} 分享量：{{deail.shareCnt}}</p></div>
        </div>
        <div class="content-text" v-html="deail.content"></div>
        <div class="detail-middle">
          <img src="../../static/img/detail_img.png" />
        </div>
        <card>
          <div slot="content" class="card-demo-flex card-demo-content01 detail-img">
            <div class="vux-1px-l vux-1px-r">
              <qrcode :fg-color="'#000'" v-show="!qrcodeShow" v-model="codeurl" type="img" class="img_qr"></qrcode>
              <qrcode-addtag v-show="qrcodeShow" :logo="logo" :codeurl="codeurl"></qrcode-addtag>
              <br/>
              扫描微信二维码
            </div>
            <div class="vux-1px-r">
              <div>
                  <img class="fingerprint" src="../../static/img/zhiwenshibie@2x.png" />
              </div>
              <br/>
              长按指纹识别图中二维码
            </div>
          </div>
        </card>
      </div>
      <div class="tabbar-icon">
        <tabbar >
          <tabbar-item class="icon-first" @click.native.prevent="collectevent">
            <img slot="icon" v-if="!collectjudge" src="../../static/img/shoucang-weidianji@2x.png">
            <img slot="icon" v-if="collectjudge" src="../../static/img/shoucang-dianji@2x.png">
            <span slot="label" :class="{collect:collectjudge}">收藏</span>
          </tabbar-item>
          <tabbar-item @click.native.prevent="share">
            <img slot="icon" src="../../static/img/zhuanfa@2x.png">
            <span slot="label">分享</span>
          </tabbar-item>
        </tabbar>
      </div>
      <share-float :shareshow="shareshow" v-on:sharefriends="hideshare"></share-float>
    </div>
</template>
<script>
var timeStamp = String(parseInt(Number(new Date()) / 1000))
import ShareFloat from '../comment/ShareFloat'
import QrcodeAddtag from '../comment/QrcodeAddtag'
import { Card, Tabbar, TabbarItem, Group, Cell, Qrcode } from 'vux'
import api from '../api'
import utils from '../utils'
export default {
  data () {
    return {
      detaillist: [],
      qrcodeShow: true,
      shareshow: false,
      collectjudge: false,
      contentwx: '',
      tokenval: '',
      codeurl: '',
      logo: '',
      item: {}
    }
  },
  components: {
    Card,
    Tabbar,
    TabbarItem,
    Group,
    Cell,
    Qrcode,
    ShareFloat,
    QrcodeAddtag
  },
  created () {
    window.document.title = '内容详情'
    this.loadContent()
    var params = {
      userId: this.$store.state.userID || '',
      partnerId: utils.getQueryString('partnerId'),
    }
    api.creditloanDetail(params).then(res => {
      console.log(res,12)
      if (res.status === '200') {
        this.item = res.data
      }
    })   
  },
  methods: {
    share () {
      this.WXsharecontent()
      var contentshare = true
      this.shareshow = true
      utils.refreshShare(this.$wechat, this.$store, api, contentshare, utils.getQueryString('article_id'))
    },
    hideshare () {
      this.shareshow = false
    },
    loadContent () {
      this.tokenval = utils.AnonToken(timeStamp)
      var params = {
        id: utils.getQueryString('article_id'),
        Tokenuser: this.tokenval,
        userid: this.$store.state.userID,
        timestamp: timeStamp
      }
      api.articledetail(params).then(res => {
        console.log(res)
        if (res.status === '200') {
          this.contentwx = res.data
          this.collectjudge = res.data.collectFlag
          this.detaillist = this.detaillist.concat(res.data)
          if (utils.getQueryString('partnerId') !== '' && utils.getQueryString('partnerId') !== null && utils.getQueryString('partnerId') !== undefined) {
            this.codeurl = process.env.BASE_URL + '/creditLogin/index?shareParam=share&userId=' + this.$store.state.userID + '&postId=' + res.data.id + '&partnerId=' + utils.getQueryString('partnerId') + '&channel=6'
          } else {
            this.codeurl = process.env.BASE_URL + '/creditLogin/index?shareParam=share&userId=' + this.$store.state.userID + '&postId=' + res.data.id + '&channel=6'
          }
          if (this.contentwx.qrCodeLogoIsShow) {
            this.qrcodeShow = true
            // this.logo = this.contentwx.logoUrl
            this.logo = this.$store.state.logoUrl + this.partnerId + '.png'
          } else {
            this.qrcodeShow = false
          }
          this.WXsharecontent()
          utils.jssdkwx(api, this.$wechat, this.$store)
        } else if (res.status === '400005016' || res.status === '400006003') {
          this.$router.push('/creditGuest/index')
        }
      })
    },
    collectevent () {
      var num
      if (this.collectjudge === true) {
        // 取消收藏
        num = 1
      } else if (this.collectjudge === false) {
        // 收藏
        num = 0
      }
      var tokenval = utils.AuthToken(timeStamp, this.$store.state.userkey)
      api.collect({
        token: tokenval,
        timestamp: timeStamp,
        userId: this.$store.state.userID,
        postId: utils.getQueryString('article_id'),
        collectStatus: num
      }).then(res => {
        if (res.status === '200') {
          this.collectjudge = !this.collectjudge
        }
      })
    },
    WXsharecontent () {
      var sharetitle = this.contentwx.title
      var shareimg = this.contentwx.picUrl
      var sharedesc = this.contentwx.summary
      var shareParams
      if (utils.getQueryString('partnerId') !== '' && utils.getQueryString('partnerId') !== null && utils.getQueryString('partnerId') !== undefined && utils.getQueryString('partnerId') !== 'undefined') {
        shareParams = '?shareParam=share&userId=' + this.$store.state.userID + '&postId=' + this.contentwx.id + '&partnerId=' + utils.getQueryString('partnerId')
      } else {
        shareParams = '?shareParam=share&userId=' + this.$store.state.userID + '&postId=' + this.contentwx.id
      }
      var shareUrl = this.$store.state.Url + '/article/detail_out'
      this.$store.commit('changeIndexConf', {
        shareTitle: sharetitle,
        shareDesc: sharedesc,
        shareImg: shareimg,
        shareLink: shareUrl + shareParams
      })
    }
  }
}
</script>
